<template>
  <div class="doctor-header">
      <div class="img-container">
          <img src="../../../static/img/banner.png" alt="">
      </div>
      <div>
          <p class="orange-color">医生姓名</p>
          <p>
              擅长项目：
              <router-link to="" class="orange-bg">眼部</router-link>
              <router-link to="" class="orange-bg">眼部</router-link>
              <router-link to="" class="orange-bg">眼部</router-link>
            </p>
          <p>
            <span><i class="light-gray">预约</i>123 <label>|</label></span>
            <span><i class="light-gray">案例</i>1212<label>|</label></span>
            <span><i class="light-gray">咨询</i>34</span>

          </p>
      </div>
      <div>
          <p class="orange-color">用手机APP跟医院联系</p>
      </div>
  </div>
</template>
<style scoped lang="less">
    .doctor-header{
        overflow: hidden;
        .img-container{
            width: 100px;
            height: 100px;
            margin-right: 24px;
        }
        a{
            margin-right: 10px;
        }
        div{
            float: left;
            p{
                line-height: 30px;
            }
            span{
                line-height: 1;
                i{
                    margin-right: 10px;
                }
                label{
                    padding: 0 12px;
                }
            }
            &:last-child{
                float: right;
                p{
                    margin-top: 50px;
                    margin-right: 20px;
                }
            }
        }
    }
</style>

